<html>
<head>
<title>'jstest.jsp' Playing with CSS and JS</title>
<script type="text/javascript" src="jquery/jquery.js"></script>
<script type="text/javascript">
	$(document)
			.ready(
					function() {
						$("#button1").click(function(event) {
							$("#b").removeClass("class2");
							$("#b").addClass("class1");
						});
						$("#button2").click(function(event) {
							$("#b").removeClass("class1");
							$("#b").addClass("class2");
						});
						$("#button3")
								.click(
										function(event) {
											$
													.getJSON(
															"ServiceServlet?mode=getmeasurepoint",
															function(data) {
																var o = "Response from "
																		+ new Date()
																		+ "<br/>";
																o += "<table><tr><th>ID</th><th>Station</th><th>Comment</th><th>URL</th></tr>"
																for (i = 0; i < data.length; i++) {
																	o += "<tr><td>"
																			+ data[i].id
																			+ "</td><td>"
																			+ data[i].controllerUnit.stationAlias
																			+ "</td><td>"
																			+ data[i].comment
																			+ "</td><td>"
																			+ data[i].readValUrl
																			+ "</td></tr>"
																}
																o += "</table>"
																$("#dataoutput")
																		.html(o);
															});
										});

					});
</script>
<style type="text/css">
@import "css/mystyle.css";
</style>
</head>
<body id="b" class="class1">
	<h1>File 'jstest.jsp' of application 'WBH-Projekt-Studie'</h1>
	<div>This page was created to play a little bit with CSS,
		Java-Script, AJAX and JSON</div>
	<div>
		<button id="button1">Layout Class 1</button>
		<button id="button2">Layout Class 2</button>
	</div>
	<div>
		<button id="button3">Requesting Measurepoints with AJAX and
			JSON</button>
	</div>
	<div>
		raw-data can be requested from <a
			href="ServiceServlet?mode=getmeasurepoint" target="_blank">ServiceServlet?mode=getmeasurepoint</a>
	</div>
	<div id="dataoutput"></div>
	<div>
		<a href="index.jsp">Back to index.jsp</a>
	</div>
</body>
</html>